@import './search.scss';
@import '~/common/style/index.scss';
$input-prefix-cls: #{$cui-prefix}-input;

.#{$input-prefix-cls}{
    width: 100%;
    display: flex;
    position: relative;
    align-items: center;
    &-input{
        flex: 1;
        height: 36px;
        /* color_neutral/98 */
        background: $gray-98;
        /* Inside auto layout */
        order: 0;
        border: none;
        outline: none;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        padding: 8px 12px 8px 12px;
        box-sizing: border-box;
        &::placeholder{
            color: #919BA1;
        }
        &-square{
            border-radius: 4px;
        }
    }
    &-disabled{
        &>input{
            cursor: not-allowed;
        }
    }
    &-round{
        .#{$input-prefix-cls}-input{
            border-radius: 24px;
        }
    }
    &-square{
        .#{$input-prefix-cls}-input{
            border-radius: 4px;
        }
    }
    &-error{
        .#{$input-prefix-cls}-input{
            border: 1px solid $red-5;
        }
    }
    &-suffixIcon{
        position: absolute;
        cursor: pointer;
        right: 12px;
        display: flex;
        .#{$input-prefix-cls}-input{
            padding-right: 32px;
        }
    }

    &-dark{
        .#{$input-prefix-cls}-input{
            background-color: $gray-2;
            color: $gray-98;
        }
    }
    
}

